import React from 'react';

import useScrollPosition from './hooks/scroll-hook';

export default function CustomScrollHook() {

  //1.
  // const [scroll, setScroll] = useState(0);

  // useEffect(() => {
  //   const handleScroll = () => {
  //     setScroll(window.scrollY);
  //   }

  //   document.addEventListener("scroll", handleScroll)

  //   return () => {
  //     document.removeEventListener("scroll", handleScroll)
  //   }
  // }, [])

  //2.
  const scroll = useScrollPosition();

  return (
    <div style={{padding: "800px 0"}}>
      <h2 style={{position: "fixed", left: 0, top: 0}}>CustomScrollHook：{scroll}</h2>
    </div>
  )
}
